<template>
  <div>
    <h1 v-text="childData"></h1>
    <button type="button" @click="sendMsg">子组件按钮</button>
    <br>
    父组件消息 >>> <span v-text="msg"></span>
    <br>
    父组件消息 >>> <span v-text="parentMsg"></span>
  </div>
  <hr style="width: 50%">
</template>

<script>
export default {
  name: "LhzB",
  data() {
    return {
      childData: "子组件数据",
      childMsg: '子组件消息',
      parentMsg: ''
    }
  },
  props: {
    msg: {
      type: String
    }
  },
  watch: {
    msg(newValue) {
      this.parentMsg = newValue;
    }
  },
  methods:{
    sendMsg(){
      this.$emit('getChildMsg',this.childMsg);
    }
  },
  emits:['getChildMsg']


}
</script>

<style scoped>

</style>